<template>
	<div class='container'>
		<h2>slot双向绑定</h2>
		<mark>请注意插槽不是响应性的</mark>
		<Child :data-config="data">
			<template #content="{ item }">
				<input v-model="item.value" type="text" />
				<p>{{ item.value }}</p>
			</template>
			
		</Child>
		<br/>
		<hr/>
		<h2>插槽名称相同的情况</h2>
		<List :data-list="dataList">
			<template #item="data">
				<div>{{ data.name }}</div>
			</template>
			<template #h1>
					哈哈哈
				</template>
		</List>
	</div>
</template>

<script setup>
import Child from './Child.vue'
import List from './List.vue'
import { ref } from 'vue'
const data = ref({
	value: ''
})
const dataList = ref([
	{
		id: '1',
		name:'随叫随到尽快'
	},
	{
		id: '2',
		name:'打卡机减肥的'
	}
])
</script>
<style lang='less' scoped>
.container {}
</style>
